<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="../static/css/bootstrap.min.css">
    <link rel="stylesheet" href="../static/css/base.css">
    <link rel="stylesheet" href="../static/css/top.css">




</head>

<body>
    <div id="container">
        <div>
            <nav class="navbar navbar-light" style="background-color: #e3f2fd;">

                <div class="collapse navbar-collapse" id="navbarNavAltMarkup">
                    <div class="navbar-nav" id="top">
                        <ul>
                            <li>
                                首页
                            </li>
                            <li>

                                <a class="nav-link" id="myQuestionair" onclick="my()">我的问卷</a>
                            </li>
                            <li>
                                <a class="nav-link" data-toggle="modal" data-target="#createQuestionair">创建问卷</a>
                            </li>
                            <li>
                                 
                                <a class="nav-link" onclick="logout()">注销</a>
                            </li>
                        </ul>



                    </div>
                </div>
            </nav>
            <!-- ///首页 -->
            <div id="content" style="margin: auto;margin-top: 150px;">
                <div class="alert alert-info" role="alert">
                    <h4 class="alert-heading">欢迎来到问卷调查系统！</h4>
                    <p> 在现实生活中，我们经常需要对一些事物进行评价，除了自己之外，也可以有其他相关的人一起评价。比如对一部电影的评价、对于物业服务的评价等等。</p>
                    <hr>
                    <p class="mb-0"> 传统的需要打印出一份份问卷调查，从打印-》分发-》填写-》收回-》统计，这些流程走下非常麻烦，而且中间还容易出现失误。

                        所以开发一套问卷调查系统来实现这个功能，实现问卷调查的信息化，提高效率。来吧！展示！
                    </p>
                </div>

            </div>


            <!-- //创建问卷 -->
            <div class="modal fade" id="createQuestionair" tabindex="-1" aria-labelledby="exampleModalLabel"
                aria-hidden="true">
                <div class="modal-dialog">
                    <div class="modal-content">
                        <div class="modal-header">
                            <h5 class="modal-title" id="exampleModalLabel">创建新的调查问卷</h5>
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                <span aria-hidden="true">&times;</span>
                            </button>
                        </div>
                        <div class="modal-body">
                            <form method="POST" action="/create">
                                <div class="form-group">
                                    <div>
                                        <h5 class="modal-title">主题：</h5>
                                        <input type="text" class="form-control" aria-describedby="passwordHelpInline"
                                            id="topic" placeholder="">
                                    </div>
                                    <div>
                                        <h5 class="modal-title">说明：</h5>
                                        <input type="text" class="form-control" aria-describedby="passwordHelpInline"
                                            id="introduction" placeholder="">
                                    </div>
                                    <div>
                                        <h5 class="modal-title" id="exampleModalLabel">选项：</h5>
                                        <label for="">1</label>
                                        <input type="text" class="form-control" aria-describedby="passwordHelpInline"
                                            id="questionOne" placeholder="请输入调查问卷问题一">
                                    </div>
                                    <div>
                                        <label for="">2</label></label>
                                        <input type="text" class="form-control" aria-describedby="passwordHelpInline"
                                            id="questionTwo" placeholder="请输入调查问卷问题二">
                                    </div>
                                    <div>
                                        <label for="">3</label></label>
                                        <input type="text" class="form-control" aria-describedby="passwordHelpInline"
                                            id="questionThree" placeholder="请输入调查问卷问题三">
                                    </div>
                                    <div>
                                        <label for="">4</label></label>
                                        <input type="text" class="form-control" aria-describedby="passwordHelpInline"
                                            id="questionFour" placeholder="请输入调查问卷问题四">
                                    </div>
                                    <div>
                                        <label for="">5</label></label>
                                        <input type="text" class="form-control" aria-describedby="passwordHelpInline"
                                            id="questionFive" placeholder="请输入调查问卷问题五">
                                    </div>
                                    <div>
                                        <label for="">6</label></label>
                                        <input type="text" class="form-control" aria-describedby="passwordHelpInline"
                                            id="questionSix" placeholder="请输入调查问卷问题六">
                                    </div>
                                    <div>
                                        <label for="">7</label></label>
                                        <input type="text" class="form-control" aria-describedby="passwordHelpInline"
                                            id="questionSeven" placeholder="请输入调查问卷问题七">
                                    </div>
                                    <div>
                                        <label for="">8</label></label>
                                        <input type="text" class="form-control" aria-describedby="passwordHelpInline"
                                            id="questionEight" placeholder="请输入调查问卷问题八">
                                    </div>
                                    <div>
                                        <label for="">9</label></label>
                                        <input type="text" class="form-control" aria-describedby="passwordHelpInline"
                                            id="questionNine" placeholder="请输入调查问卷问题九">
                                    </div>
                                    <div>
                                        <label for="">10</label></label>
                                        <input type="text" class="form-control" aria-describedby="passwordHelpInline"
                                            id="questionTen" placeholder="请输入调查问卷问题十">
                                    </div>


                                </div>
                                <div class="modal-footer">
                                    <button type="button" class="btn btn-secondary" data-dismiss="modal">取消</button>
                                    <button type="button" class="btn btn-primary" data-dismiss="modal"
                                        onclick="create()">创建</button>
                                </div>
                            </form>
                        </div>

                    </div>
                </div>
            </div>


        </div>
    </div>


    <script src="../static/js/jquery-3.6.0.min.js"></script>
    <script src="https://cdn.bootcss.com/axios/0.18.0/axios.min.js"></script>
    <script src="../static/js/bootstrap.min.js"></script>
    <script>
        //注销
        function logout() {
            axios({
                method: 'post',
                url: '/logout'
            }).then(function (response) {
                // axios工具下，服务器真正返回的数据在返回对象的data中
                let res = response.data;
                if (res.code === 200) {
                    window.location.href = '/user';
                }
            }).catch((err) => {

            });
        }
        function my() {
            window.location.href = '/all';
        }

        //创建调查问卷
        function create() {
            var topic = $('#topic').val();
            var introduction = $('#introduction').val();
            var questionOne = $('#questionOne').val();
            var questionTwo = $('#questionTwo').val();
            var questionThree = $('#questionThree').val();
            var questionFour = $('#questionFour').val();
            var questionFive = $('#questionFive').val();
            var questionSix = $('#questionSix').val();
            var questionSeven = $('#questionSeven').val();
            var questionEight = $('#questionEight').val();
            var questionNine = $('#questionNine').val();
            var questionTen = $('#questionTen').val();
            console.log(introduction);
            axios({
                method: 'post',
                url: '/create',

                data: {
                    topic,
                    introduction,
                    questionOne,
                    questionTwo,
                    questionThree,
                    questionFour,
                    questionFive,
                    questionSix,
                    questionSeven,
                    questionEight,
                    questionNine,
                    questionTen
                }
            }).then(function (response) {
                // axios工具下，服务器真正返回的数据在返回对象的data中
                let res = response.data;
                if (res.code === 200) {
                    window.location.href = '/all'
                }
            })
        }
    </script>
</body>

</html>